<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>拼团区</title>
    <meta content="yes" name="apple-mobile-web-app-capable"><!--可隐藏地址栏，仅针对IOS的Safari（注：IOS7.0版本以后，safari上已看不到效果）-->
    <meta content="yes" name="apple-touch-fullscreen"><!--添加到主屏幕后，全屏显示-->
    <meta content="telephone=no,email=no" name="format-detection"><!--IOS中禁用将数字识别为电话号码/忽略Android平台中对邮箱地址的识别-->
    <meta http-equiv="X-UA-Compatible" content="IE=Edge" /><!--避免IE使用兼容模式-->
    <meta content="black" name="apple-mobile-web-app-status-bar-style"><!--仅针对IOS的Safari顶端状态条的样式（可选default/black/black-translucent ）-->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="../css/base.css"/>
    <link rel="stylesheet" href="../css/index.css"/>
</head>
<body>
<!--拼团区-->
<section class="collage">
    <div class="collage-title">
        <p>注册会员还可获得300积分，快快来注册吧！</p>
        <a href="">注册 ></a>
    </div>
    <div class="collage-list">
        <ul class="clearfix">
            <li>
                <a href="./detail.html">
                    <img src="../images/mall/product/product03.png" alt="">
                    <p>去哪儿网火车票立减券</p>
                    <p>
                        <span>0</span>
                        <span>积分</span>
                    </p>
                    <p class="clearfix">
                        <span>距开奖仅剩</span>
                        <span class="count-down" id="countDown1">
                                <span class="days"><i>0</i><i>0</i></span>天<span class="time"><i>0</i><i>0</i></span>:<span class="time"><i>0</i><i>0</i></span>:<span class="time"><i>0</i><i>0</i></span>
                            </span>
                    </p>
                    <div class="progress clearfix">
                        <span>已拼积分</span>
                        <div class="progress-right">
                            <div class="progress-value"></div>
                            <p><span class="pro-val" id="proVal1">0</span>%</p>
                        </div>
                    </div>
                    <div class="rush-to-buy active">
                        <div class="content">
                            <p>马上拼 ></p>
                        </div>
                    </div>
                </a>
            </li>
            <li>
                <a href="./detail.html">
                    <img src="../images/mall/product/product03.png" alt="">
                    <p>去哪儿网火车票立减券</p>
                    <p>
                        <span>0</span>
                        <span>积分</span>
                    </p>
                    <p class="clearfix">
                        <span>距开奖仅剩</span>
                        <span class="count-down" id="countDown2">
                                <span class="days"><i>0</i><i>0</i></span>天<span class="time"><i>0</i><i>0</i></span>:<span class="time"><i>0</i><i>0</i></span>:<span class="time"><i>0</i><i>0</i></span>
                            </span>
                    </p>
                    <div class="progress clearfix">
                        <span>已拼积分</span>
                        <div class="progress-right">
                            <div class="progress-value"></div>
                            <p><span class="pro-val" id="proVal2">50</span>%</p>
                        </div>
                    </div>
                    <div class="rush-to-buy">
                        <div class="content">
                            <p>已成团</p>
                        </div>
                    </div>
                </a>
            </li>
            <li>
                <a href="./detail.html">
                    <img src="../images/mall/product/product03.png" alt="">
                    <p>去哪儿网火车票立减券</p>
                    <p>
                        <span>0</span>
                        <span>积分</span>
                    </p>
                    <p class="clearfix">
                        <span>距开奖仅剩</span>
                        <span class="count-down" id="countDown3">
                                <span class="days"><i>0</i><i>0</i></span>天<span class="time"><i>0</i><i>0</i></span>:<span class="time"><i>0</i><i>0</i></span>:<span class="time"><i>0</i><i>0</i></span>
                            </span>
                    </p>
                    <div class="progress clearfix">
                        <span>已拼积分</span>
                        <div class="progress-right">
                            <div class="progress-value"></div>
                            <p><span class="pro-val" id="proVal3">0</span>%</p>
                        </div>
                    </div>
                    <div class="rush-to-buy active">
                        <div class="content">
                            <p>马上拼 ></p>
                        </div>
                    </div>
                </a>
            </li>
            <li>
                <a href="./detail.html">
                    <img src="../images/mall/product/product03.png" alt="">
                    <p>去哪儿网火车票立减券</p>
                    <p>
                        <span>0</span>
                        <span>积分</span>
                    </p>
                    <p class="clearfix">
                        <span>距开奖仅剩</span>
                        <span class="count-down" id="countDown4">
                                <span class="days"><i>0</i><i>0</i></span>天<span class="time"><i>0</i><i>0</i></span>:<span class="time"><i>0</i><i>0</i></span>:<span class="time"><i>0</i><i>0</i></span>
                            </span>
                    </p>
                    <div class="progress clearfix">
                        <span>已拼积分</span>
                        <div class="progress-right">
                            <div class="progress-value"></div>
                            <p><span class="pro-val" id="proVal4">50</span>%</p>
                        </div>
                    </div>
                    <div class="rush-to-buy">
                        <div class="content">
                            <p>已成团</p>
                        </div>
                    </div>
                </a>
            </li>
        </ul>
    </div>
</section>
<script src="../lib/jquery/jquery.min.js"></script>
<script src="../lib/template.js"></script>
<script src="../js/popup.js"></script>
<script>
    $(function () {
        var time = 2 * 24 * 60 * 60;//天、时、分、秒
        downTime(time,'#countDown1 i');
        downTime(time,'#countDown2 i');
        downTime(time,'#countDown3 i');
        downTime(time,'#countDown4 i');
        progressVal('#proVal1',10);
        progressVal('#proVal2',20);
        progressVal('#proVal3',30);
        progressVal('#proVal4',40);
    })
</script>
</body>
</html>